},
};

const createDimensionsExtractor = () => {
  const dimensions: { width?: number; height?: number; aspectRatio?: number } =
    {};
  const plugin = {
    type: "visitor",
    name: "extract-dimensions",
    fn() {
      return {
        element: {
          // Node, parentNode
          enter({ name, attributes }, { type }) {
            if (name === "svg" && type === "root") {
              if (
                attributes.width !== undefined &&
                attributes.height !== undefined
              ) {
                dimensions.width = Number.parseFloat(attributes.width);
                dimensions.height = Number.parseFloat(attributes.height);
              } else if (attributes.viewBox !== undefined) {
                const viewBox = attributes.viewBox.split(/,\s*|\s+/);
                dimensions.width = Number.parseFloat(viewBox[2]);
                dimensions.height = Number.parseFloat(viewBox[3]);
                const ratio = dimensions.width / dimensions.height;
                dimensions.aspectRatio =
                  ratio && isFinite(ratio) ? ratio : undefined;
              }
            }
          },
        },
      };
    },
  };

  return { dimensions, plugin };
};

export const makeTypedFieldSql = (
  field: string,
  fieldMetaMap: FieldMetaMap,
  opts: { useDraft?: boolean }
) => {
  const dataRef = makeDataRef(opts);
  if (field === "_id") {
    return "r.id";
  }

  // Simple field access
  const meta = fieldMetaMap[field];
  if (meta) {
    return `(${dataRef}->''->>'${meta.identifier}')::${typeToPgType(
      meta.type
    )}`;
  }

  // TODO: handle more than one level of nesting
  // TODO: allow escaping "." in field identifier
  if (field.includes(".")) {
    const [objectField, nestedField] = field.split(".");

    const objectFieldMeta = fieldMetaMap[objectField];
    if (objectFieldMeta && objectFieldMeta.type === CmsMetaType.OBJECT) {
      const nestedFieldMeta = objectFieldMeta.fields.find(
        (f) => f.identifier === nestedField
      );

      if (nestedFieldMeta) {
        return `(${dataRef}->''->'${objectFieldMeta.identifier}'->>'${
          nestedFieldMeta.identifier
        }')::${typeToPgType(nestedFieldMeta.type)}`;
      }
    }
  }

  return null;
};

export function parseBoxShadows(shadows: string): string {
  if (!shadows.trim()) {
    return "";
  }

  const valueAst = parse(shadows, { context: "value" });
  if (valueAst.type !== "Value") {
    return "";
  }

  const shadowsList: Array<List<CssNode>> = [];
  let currentShadow = new List<CssNode>();

  /* valueAst represent a Value node for box-shadow property, it will have children node such as
   * Identifier -> inset, Dimension -> length, Function -> rgb(), var(), Hash -> hex color,
   * Most importantly, in case of multiple shadows which are separated using comma, we have an Operator node
   * that represents the comma.
   *
   * To collect individual box-shadow, we need to collect all the nodes between each Operator node. For example,
   * box-shadow: 2px, 4px, #fff, 0px, 3px, rgb(0,0,0,0.5) will be represented as
   * [ Dimension, Dimension, Hash, Operator, Dimension, Dimension, Function ] and converted to
   * [ [Dimension, Dimension, Hash], [Dimension, Dimension, Function] ]
   */
  valueAst.children.forEach((child) => {
    if (child.type === "Operator" && child.value === ",") {
      shadowsList.push(currentShadow);
      currentShadow = new List<CssNode>();
    } else {
      currentShadow.push(child);
    }
  });
  shadowsList.push(currentShadow);

  return shadowsList.map((shadow) => parseBoxShadow(shadow)).join(", ");
}

/**
 * Parse a single box-shadow AST nodes into the following format:
 *   "[inset] offsetX offsetY blurRadius spreadRadius color"
 */
function parseBoxShadow(shadowNodes: List<CssNode>) {
  let inset = false;
  let color: string | undefined = undefined;
  const dims: string[] = [];

  for (const node of shadowNodes) {
    switch (node.type) {
      case "Identifier":
        if (node.name.toLowerCase() === "inset") {
          inset = true;
        } else if (node.name.toLowerCase() === "currentcolor") {
          color = "currentcolor";
        }
        break;

      case "Function":
        if (!color && (node.name === "var" || node.name.startsWith("rgb"))) {
          color = generate(node);
        }
        break;

      case "Hash":
        if (!color) {
          color = `#${node.value}`;
        }
        break;

      case "Dimension":
        dims.push(generate(node));
        break;

      default:
        break;
    }
  }

  while (dims.length < 4) {
    dims.push("0px");
  }

  if (!color) {
    color = "currentcolor";
  }

  return [inset ? "inset" : "", dims[0], dims[1], dims[2], dims[3], color]
    .filter(Boolean)
    .join(" ");
}